import React, { Component, createRef } from 'react'

class Child1 extends Component {
  render() {
    return (
      <div>
        <h3>child1 -- {this.props.count}</h3>
      </div>
    )
  }
}

class Child2 extends Component {
  render() {
    return (
      <div>
        <button
          onClick={() => {
            this.props.setCount(1)
          }}
        >
          ++count++ child2
        </button>
      </div>
    )
  }
}

class App extends Component {
  // 兄弟组件间通信可以通过 状态提升实现
  // 把兄弟组件共用的数据提升到他们的父组件上就可以
  state = {
    count: 100
  }

  setCount = (n) => {
    this.setState((state) => ({
      count: state.count + n
    }))
  }

  render() {
    return (
      <div>
        <h2>app组件 -- {this.state.count}</h2>
        <hr />
        <Child1 count={this.state.count} />
        <Child2 setCount={this.setCount} />
      </div>
    )
  }
}

export default App
